﻿// Please see documentation at https://learn.microsoft.com/aspnet/core/client-side/bundling-and-minification
// for details on configuring this project to bundle and minify static web assets.

$(function () {
    // 1. 全局变量：内容容器、加载提示HTML
    const $mainContent = $('#mainContent'); // 动态内容容器
    const loadingHtml = `
        <div class="d-flex justify-content-center align-items-center" style="height: 300px;">
            <div class="spinner-border text-primary" role="status">
                <span class="visually-hidden">加载中...</span>
            </div>
        </div>
    `; // 加载中动画

    // 2. 监听所有导航链接的点击事件（包含子菜单）
    $('body').on('click', '.nav-link[data-url]', function () {
        const $this = $(this);
        const targetUrl = $this.data('url'); // 目标页面URL（从data-url获取）
        const menuId = $this.data('menu-id'); // 导航项唯一标识（从data-menu-id获取）

        if (!targetUrl) return; // 无URL则不处理

        // 3. 显示加载状态
        $mainContent.html(loadingHtml);

        // 4. 发送AJAX请求，获取目标页面的局部内容
        $.ajax({
            url: targetUrl,
            type: 'GET',
            dataType: 'html', // 预期返回HTML
            success: function (response) {
                // 5. 成功：替换Main区域内容
                $mainContent.html(response);

                // 6. 更新导航激活状态（移除所有active，给当前项添加active）
                $('.nav-link').removeClass('active');
                $this.addClass('active');

                // 7. （可选）更新浏览器URL，支持前进/后退（不刷新页面）
                window.history.pushState({ menuId: menuId }, '', targetUrl);

                // 8. （可选）如果目标页面有独立JS，执行JS（需确保JS不重复加载）
                executeInlineScript(response);
            },
            error: function (xhr, status, error) {
                // 9. 失败：显示错误提示
                $mainContent.html(`
                    <div class="alert alert-danger mt-3" role="alert">
                        加载失败！错误信息：${error}
                        <button type="button" class="btn-close float-end" data-bs-dismiss="alert" aria-label="Close"></button>
                    </div>
                `);
            }
        });
    });

    // site.js 中修改 executeInlineScript 函数
    function executeInlineScript(html) {
        const $temp = $('<div>').html(html);
        $temp.find('script').each(function () {
            const scriptContent = $(this).html();
            if (scriptContent) {
                // 若脚本包含 Vue.createApp（Vue 初始化逻辑），则跳过（主布局已初始化）
                if (!scriptContent.includes('Vue.createApp')) {
                    eval(scriptContent); // 执行非 Vue 初始化的脚本
                } else {
                    console.log('跳过重复的 Vue 初始化脚本');
                }
            }
        });
    }

    // 11. （可选）处理浏览器前进/后退按钮（恢复对应页面内容）
    window.addEventListener('popstate', function (event) {
        const state = event.state;
        if (state && state.menuId) {
            // 根据历史记录中的menuId，找到对应的导航项并触发点击
            const $menuItem = $(`.nav-link[data-menu-id="${state.menuId}"]`);
            if ($menuItem.length) {
                $menuItem.trigger('click');
            }
        }
    });


});